<html xmlns="http://www.w3.org/1999/xhtml"
        xmlns:h="http://xmlns.jcp.org/jsf/html"
        xmlns:f="http://xmlns.jcp.org/jsf/core"
        xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
        xmlns:p="http://primefaces.org/ui">
<h:head>
    <title>ActionBazaar</title>
    <h:outputStylesheet library="css" name="site.css"/>
</h:head>
<h:body>
    <ui:composition template="/WEB-INF/template.xhtml">
        <ui:define name="content">
            <h:form enctype="multipart/form-data">
                <p:panel header="Images">
                    Please upload at least one picture of your item:
                    <table>
                        <tr>
                            <td>
                                <h:graphicImage id="image-1" value="/image?name=#{sellController.image1}"/>
                            </td>
                            <td>
                                <h:graphicImage id="image-2" value="/image?name=#{sellController.image2}"/>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <p:fileUpload immediate="true" auto="true" fileUploadListener="#{sellController.uploadImage1}" mode="simple" update="image-1"/>
                            </td>
                            <td>
                                <p:fileUpload immediate="true" auto="true" fileUploadListener="#{sellController.uploadImage2}" mode="simple" update="image-2"/>
                            </td>
                        </tr>
                    </table>
                </p:panel>
                <p:panel header="Information">
                    <table>
                        <tr>
                            <td>Title:</td>
                            <td><h:inputText value="#{sellController.title}"/></td>
                        </tr>
                    </table>
                    <table>
                        <tr>
                            <td>Description:</td>
                            <td><h:inputTextarea value="#{sellController.description}"/></td>
                        </tr>
                    </table>
                    <table>
                        <tr>
                            <td>Bidding length:</td>
                            <td>
                                <h:selectOneMenu value="duration">
                                    <f:selectItem itemValue="7" itemLabel="1 Week"/>
                                    <f:selectItem itemValue="14" itemLabel="2 Weeks"/>
                                    <f:selectItem itemValue="30" itemLabel="1 Month"/>
                                </h:selectOneMenu>
                            </td>
                        </tr>
                    </table>

                    <table>
                        <tr>
                            <td>Minimum Bid:</td>
                            <td><h:inputTextarea value="#{sellController.minimumPrice}"/></td>
                        </tr>
                    </table>
                </p:panel>
                <p:commandButton ajax="false" action="#{sellController.performContinue}" value="Sell"/>
            </h:form>
        </ui:define>
    </ui:composition>
</h:body>
</html>